import React from 'react'
import ReactECharts from 'echarts-for-react';
import './Index.css'
import {option1} from '../compones/one'
import {option2} from '../compones/two'
import {option3} from '../compones/tree'
import {option4} from '../compones/b1'
import {option6} from '../compones/b2'
import {option5} from '../compones/b5'
// 6.实现“到店对比”，将其中的标题封装为自定义组件
import Bt from '../compones/bt'
import B6 from '../compones/b6';
// import * as echarts from 'echarts';
import axios from 'axios';
function Home() {
  return (
    <div>
        <div className='da'>
        <div className='head'>
        <h1>某公司大数据展示标题</h1>
        <span>2025/06/17 &nbsp; 19:44:17 星期二</span>
      </div>
      <div className='left'>
        <div className='a1'>
            {/* 6.实现“到店对比”，将其中的标题封装为自定义组件 */}
            <Bt></Bt>
            <ReactECharts option={option1} />
        </div>
        <div className='a2'>
            <span style={{color:"white"}}>使用率排行</span>
             <ReactECharts option={option2} />
        </div>
        <div className='a3'>
               <span style={{color:"white"}}>带宽使用率排行</span>
             <ReactECharts option={option3} />
        </div>
      </div>
      <div className='zhong'>
        <div className='ditu' >
        <h2 style={{color:"white",marginTop:"14px"}}>地图显示</h2>
              <ReactECharts option={option5} />
        </div>
        <div className='wen'>
             <span style={{color:"white"}}>销售地区</span>
            <B6></B6>
        </div>
      </div>
      <div className='right'>
        <div className='b1'>
               <span style={{color:"white"}}>搜素排行</span>
            <ReactECharts option={option4} />
        </div>
        <div className='b2'>
                      <span style={{color:"white"}}>营销分配</span>
              <ReactECharts option={option6} style={{marginTop:"60px"}} />
        </div>

      </div>
        </div>
    
    </div>
  )
}

export default Home
